<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>积分兑换</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/swiper.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/layer.css" />
    <link rel="stylesheet" type="text/css" href="../css/mdw.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../script/swiper.min.js"></script>
    <script type="text/javascript" src="../script/mobile.js"></script>
    <script type="text/javascript" src="../script/layer.js"></script>
    <script type="text/javascript" src="../script/mdw.js"></script>
    <script type="text/javascript" src="../script/jumpPage.js"></script>
</head>
<body class="bg-eee">
    <header class="header">
        <div class="backPrevPage on" onclick="historyBack()"></div>
        <div class="pageTitle">积分兑换</div>
    </header>
    <section class="integralCouponPage HTML_BOX">
        <div id="score" class="pageTitle bg-fff plr displayFlex"></div>
       <ul class="couponList plr">
        <!-- on表示可用。 没有on表示不可用或已使用 -->
           <!-- <li class="on">
               <div class="couponLeft">
                   <div class="">$<span class="coupon_price">50</span></div>
                   <div class="coupon_cond">满500使用</div>
               </div>
               <div class="couponRight">
                   <div class="couponInfo">
                       <div class="couponTitle">仅限水果类商品可用</div>
                       <div class="couponTime">2018-12-8~12-12</div>
                       <div class="couponCount">500积分</div>
                   </div>
                   <div class="coupon_no">积分不足</div>
               </div>
           </li>
           <li class="on">
               <div class="couponLeft">
                   <div class="">$<span class="coupon_price">50</span></div>
                   <div class="coupon_cond">满500使用</div>
               </div>
               <div class="couponRight">
                   <div class="couponInfo">
                       <div class="couponTitle">仅限水果类商品可用</div>
                       <div class="couponTime">2018-12-8~12-12</div>
                       <div class="couponCount">500积分</div>
                   </div>
                   <div class="coupon_go">立刻兑换</div>
               </div>
           </li> -->
       </ul>
    </section>
    <!-- 弹窗 -->
  <div class="mask_pop">
    <div class="mask" ></div>
    <div class="coupon_pop pop_item dn">
        <div class="coupon_popImage">
            <img src="../image/coupon_pop_bg.png"/>
        </div>
        <div class="en_title" style="margin-top: .5rem">恭喜你！兑换成功</div>
        <div class="en_title" style="margin-top: .2rem">可以在我的优惠券里查看</div>
        <div class="coupon_pop_btn f_c">立刻查看</div>
        <div class="pop_close coupon_close"></div>
    </div>
    <div class="coupon_pop pop_item dn">
        <div class="coupon_popImage">
            <img src="../image/coupon_pop_bg.png"/>
        </div>
        <div class="en_title" style="margin-top: .2rem">您确认要兑换<span id="coupon_name"></span>优惠券吗？</div>
        <div class="coupon_btns">
          <div class="qr">确定</div>
          <div class="qx">取消</div>
        </div>
        <div  class="pop_close coupon_close"></div>
    </div>
  </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
    $(".coupon_close").click(function(){
        maskClose();
        $(".pop_Item").addClass("dn");
    })
    $(".qx").click(function(){
        maskClose();
        $(".pop_Item").addClass("dn");
    })
    $(".coupon_pop_btn").click(function(){
        openWin('member_coupon','member_coupon.html');
        $(".pop_Item").addClass("dn");
        maskClose();
    })
     $(".qr").click(function(){
        maskClose();
        $(".pop_Item").addClass("dn");
        coupon();
    })
    var param={};
    apiready = function(){
        $api.fixStatusBar($api.dom('header'));
        api.setStatusBarStyle({
            color: '#fff',//设置APP状态栏背景色
            style: 'dark'
        });
        param=api.pageParam;
        if(cnen==1){
          $("#score").html("当前积分："+param.score);
        }else{
          $("#score").html("Current score："+param.score);
        }
        
        ifCnAndEn();
        ready();

    };
    function ready(){
      pop.loading();
      getAjax(Interface.member_coupon_list,{token:token},function(res){
        //console.log(JSON.stringify(res));
        var list = res.data;
        if(list!="" && list !=null && list !=false){
          $.each(list,function(i,item){
              duihuan = '立刻兑换';
              jifen = '积分不足';
              score = "所需积分";
              var satisfy ='<div class="coupon_cond">满'+item.manzu+'使用</div>';
              if(cnen==2){
                  duihuan ='Exchange';
                  jifen ='No way';
                  score = "Need score";
                  satisfy ='<div class="coupon_cond">Satisfy $'+item.manzu+'</div>';
              }
              var html ='<li id="c_'+item.id+'" class="on">';
                   html+='<div class="couponLeft">';
                         html+='<div class="">$<span class="coupon_price">'+item.val3+'</span></div>';
                         html+=satisfy;
                     html+='</div>';
                     html+='<div class="couponRight">';
                         html+='<div class="couponInfo">';
                             html+='<div class="couponTitle">'+item.title+'</div>';
                             html+='<div class="couponTime">'+timestampToTime(item.start_time)+'~'+timestampToTime(item.end_time)+'</div>';
                             html+='<div class="couponScore">'+score+':'+item.score+'</div>';
                         html+='</div>';
                         if(Number(param.score) >= Number(item.score)){
                            html+='<div onclick="opencouppon(\''+item.id+'\','+item.score+',\''+item.title+'\')" class="coupon_go">'+duihuan+'</div>';
                         }else{
                            html+='<div class="coupon_no">'+jifen+'</div>';
                        }
                     html+='</div>';
                 html+='</li>';
                $(".couponList").append(html);
          })
           pop.close();
        }
      },function(res,err){

      })
    }

    var cid = 0;
    var cscore = 0;
    function opencouppon(id,score,name){
      cid = id;
      cscore = score;
      $(".coupon_name").html("name");
      maskOpen();
      $(".coupon_pop").eq(1).removeClass("dn");
    }

    function coupon(){
      pop.loading();
      getAjax(Interface.member_get_coupon,{token:token,coupon_id:cid},function(res){
        console.log(JSON.stringify(res));
        pop.close();
        maskOpen();
        $(".coupon_pop").eq(0).removeClass("dn");
        param.score = Number(param.score) - Number(cscore);
        if(cnen==1){
          $("#score").html("当前积分："+param.score);
        }else{
          $("#score").html("Current score："+param.score);
        }
        //deleteElement($("#c_"+id),1);
      },function(res,err){})
    }
    function timestampToTime(timestamp) {
    //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        var date = new Date(timestamp * 1000);
        Y = date.getFullYear() + '-';
        M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
        D = (date.getDate() < 10 ? '0'+date.getDate() : date.getDate()) + ' ';
        return Y+M+D;
    }
</script>
<script type="text/javascript">
    function ifCnAndEn(){
        if(cnen==2){
            $(".pageTitle").eq(0).html('Exchange');
            $(".en_title").eq(0).html('Congratulations! Exchange success');
            $(".en_title").eq(1).html('You can check it in my coupon');
            $(".coupon_pop_btn").html('See Now');
        }
    }
</script>
</html>